<template>
	<view>
		<view v-if="isLoading == true"><image class="loading" src="https://huajia-online-1316192331.cos.ap-guangzhou.myqcloud.com/static/loading-1.gif"></image></view>
		<view v-if="isLoading == false">
			<view class="content"><image class="background" src="https://img1.baidu.com/it/u=413643897,2296924942&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500"></image></view>
			<view class="text1">{{ name }},欢迎回来！</view>
			<view class="text2">志愿时长：{{ volunteerHour }}小时{{ volunteerMin }}分钟</view>
			<view class="page">
				<view class="user-info">
					<view class="border-outer">
						<view class="border-inner"><image :src="photo" mode="widthFix" class="photo"></image></view>
					</view>
					<view class="summary">
						<view>
							<text class="title">姓名</text>
							<text class="value">{{ name }}</text>
						</view>
						<view>
							<text class="title">等级</text>
							<text class="value">{{ grade }}</text>
						</view>
						<view>
							<text class="title">状态</text>
							<text class="value">{{ statusText }}</text>
						</view>
					</view>
				</view>
				<button class="btn" size="mini" :tel="telNumber" @click="callPhone">电话咨询</button>
				<view class="list-title">用户信息栏目</view>
				<uni-list>
					<uni-list-item title="个人资料" link to="/pages/personal_data/personal_data"></uni-list-item>
					<uni-list-item title="我的活动" link to="/pages/my_activity/my_activity"></uni-list-item>
					<uni-list-item title="服务记录" link to="/pages/my_service/my_service"></uni-list-item>
					<uni-list-item title="我的消息" link to="/pages/my_message/my_message"></uni-list-item>
					<uni-list-item title="兑换商城" link to="/pages/exchange/exchange"></uni-list-item>
					<!-- <uni-list-item title="在线咨询" link to="/pages/friend_list/friend_list"></uni-list-item> -->
				</uni-list>
				
				<view class="list-title">系统管理栏目</view>
				<uni-list>
					<uni-list-item title="员工管理" v-show="checkPermission(['ROOT', 'EMPLOYEE:SELECT'])" link to="../user_list/user_list"></uni-list-item>
					<uni-list-item title="部门管理" v-show="checkPermission(['ROOT', 'DEPT:SELECT'])" link to="../dept_list/dept_list"></uni-list-item>
					<uni-list-item title="权限管理" v-show="checkPermission(['ROOT', 'ROLE:SELECT'])" link to="../role_list/role_list"></uni-list-item>
				</uni-list>
			</view>
		</view>
	</view>
</template>

<script>
//加载导入的组件
import uniList from '@/components/uni-list/uni-list.vue';
import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
export default {
	//注册组件
	components: {
		uniList,
		uniListItem
	},
	data() {
		return {
			telNumber: '10086',
			imageURL: 'https://img1.baidu.com/it/u=413643897,2296924942&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500',
			name: '',
			grade: '',
			photo: '',
			userName: '微信用户',
			volunteerHour: '0',
			volunteerMin: '0',
			statusText: '',
			isLoading: true
		};
	},
	onLoad() {
		let that = this;
		setTimeout(function(resp) {
			that.isLoading = false;
		}, 200);
	},
	onShow: function() {
		let that = this;
		that.ajax(that.url.searchUserSummary, 'GET', null, function(resp) {
			let result = resp.data.result;
			uni.setStorage({
				key: 'userId',
				data: result.id
			});
			that.name = result.name;
			uni.setStorage({
				key: 'name',
				data: that.name
			});
			uni.setStorage({
				key: 'username',
				data: result.nickname
			});
			uni.setStorage({
				key: 'avatar',
				data: result.photo
			});
			that.grade = result.grade;
			that.photo = result.photo;
			if (result.status == 1) {
				that.statusText = '正常';
			} else {
				that.statusText = '异常';
			}
			that.volunteerHour = result.volunteerHour + Math.floor(result.volunteerMin / 60);
			that.volunteerMin = result.volunteerMin % 60;
		});
	},
	methods: {
		callPhone() {
			uni.makePhoneCall({
				phoneNumber: this.telNumber
			});
		}
	}
};
</script>

<style lang="less">
@import url('mine.less');
</style>
